<!DOCTYPE html>
<html>
<head>
    <title>流式响应测试</title>
</head>
<body>
    <h1>流式响应测试</h1>
    <button onclick="testStream()">测试流式响应</button>
    <button onclick="clearResult()">清空结果</button>
    <div id="result"></div>

    <script>
        async function testStream() {
            try {
                const response = await fetch('/stream');
                const reader = response.body.getReader();
                const decoder = new TextDecoder();

                while (true) {
                    const {done, value} = await reader.read();
                    if (done) break;

                    const text = decoder.decode(value);
                    const lines = text.split('\n');

                    for (const line of lines) {
                        if (line.startsWith('data: ')) {
                            const data = line.substring(6);
                            const div = document.createElement('div');
                            div.textContent = data;
                            document.getElementById('result').appendChild(div);
                        }
                    }
                }
            } catch (error) {
                document.getElementById('result').textContent = '错误: ' + error.message;
            }
        }

        function clearResult() {
            document.getElementById('result').innerHTML = '';
        }
    </script>
</body>
</html> 